<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>添加照片</title>
	<link rel="stylesheet" type="text/css" href="css/style.css">


	<script type="text/javascript" src="js/Adaptive.js"></script>

	<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>

	<script type="text/javascript" src="js/public.js"></script>
	<script type="text/javascript" src="vue/vue.js"></script>



	<link rel="stylesheet" type="text/css" href="webuploader-0.1.5/webuploader.css">
	<script type="text/javascript" src="webuploader-0.1.5/webuploader.js"></script>

</head>
<body>




	<section id="AddPhoto">

		<div id="alertCon"  v-show="controller.alertText"><span>{{controller.alertText}}</span></div>

		<div class="AddPhotoCon" v-show="controller.isPhotoCon">
			<div id="uploader-demo" class="uploaderCon">
				<div class="timeLine" id="timeLine"><span class="line"></span></div>
		    <!--用来存放item-->
			    <div id="fileList" class="uploader-list"></div>
			    <div id="filePicker">选择图片</div>
			    <div class="confirm" v-on:click="AddPhotoList" >确定</div>

			    <div class="cloesPhotoCn" v-on:click="controller.isPhotoCon = false">取消</div>
			</div>
		</div>









		<div class="headInd">添加照片</div>
		<div class="navHead">{{navIndexAct.navTitle[navIndexAct.ind - 1].title}}</div>
		<!-- PageOne -->
		<div class="PageOne" v-show="navIndexAct.ind == 1">
			<div class="imgCon"><img :src="headPortrait"></div>
			<div class="Addph" v-on:click="controller.isPhotoCon = true">上传照片</div>
		</div>
		<!-- PageOne end -->


		<!-- pageTwo -->

		<div class="pageTwo" v-show="navIndexAct.ind == 2">
			<ul class="photoList">
				<li v-for="(item, index) in CertificatList">
					<img :src="item.pic">
					<div class="deledtC" v-on:click="DeleteCertificatList(index, item)"><i class="iconfont">&#xe640;</i></div>
				</li>
				<li class="addP" v-on:click="controller.isPhotoCon = true">
					<i class="iconfont">&#xe61c;</i>
					<p>点击添加照片</p>
				</li>

			</ul>
			<p class="describe">温馨提示：请尽量添加横版清晰照片</p>
		</div>
		<!-- pageTwo end -->

		<!-- pageThree -->
		<div class="pageThree" v-show="navIndexAct.ind == 3">
			<div class="linshiC">
				<p class="describe">请先选择对应的工作经历：</p>
				<select v-model="selectVale">
					<option v-for="(item, index) in HistoryList" :value="index">{{item.starttime.value}}--{{item.endtime.value}} {{item.name.value}} {{item.babydetail.value}}</option>
				</select>

				<div class="listCn">
					<ul  v-if="HistoryList[selectVale]" v-bind:style="{width: ((HistoryList[selectVale].PhotoList.length *220)+220)+'px'}">
						<li v-for="(item, index) in HistoryList[selectVale].PhotoList">
							<img :src="item.pic">
							<div class="deledtC" @click="DeletePhotoSon(index, item)"><i class="iconfont">&#xe640;</i></div>
						</li>

						<li class="addP" v-on:click="controller.isPhotoCon = true">
							<i class="iconfont">&#xe61c;</i>
							<p>点击添加照片</p>
						</li>
					</ul>
				</div>
				<!-- <div class="btn" id="aopen">保存</div> -->

			</div>

			<ul class="workListS">

				<li v-for="(item, index) in HistoryList">
					<div class="title">
						<span>{{item.starttime.value}}--{{item.endtime.value}} {{item.name.value}} {{item.babydetail.value}}</span>
						<div class="deledtC" @click="DeleteHistoryList(index, item)"><i class="iconfont">&#xe640;</i></div>
					</div>
					<div class="listCon">
						<ul v-bind:style="{width: (item.PhotoList *140)+'px'}">
							<li v-for="itemTwo in item.PhotoList"><img :src="itemTwo.pic"></li>
						</ul>

					</div>
				</li>

			</ul>
		</div>
		<!-- pageThree end -->


		<!-- pageFour -->
		<div class="pageFour" v-show="navIndexAct.ind == 4">
			<img src="images/photobcak.jpg">
			<div class="butCon">
				<a href="testAunt.html">进入考核测评</a>
				<a href="index.html">返回首页</a>
			</div>
		</div>
		<!-- pageFour end -->






		<div class="nextPage" v-show="navIndexAct.ind <= 3" v-on:click="pageNext"><span>{{navIndexAct.nextText}}</span></div>
	</section>



	<script type="text/javascript" src="js/addPhoto.js"></script>

	<script type="text/javascript" src="js/myUpload.js"></script>



</body>
</html>
